import React, { useEffect, useState } from 'react'
import {connect} from 'react-redux'
import { globalAlertDispatch } from '@/utils'
import {homeDataApi} from '@/reqeust'
import { useHistory } from 'react-router-dom'
import validateLogin from '@/hoc'
import { loginExpire } from '../../utils'
import './home.less'
import ArrowRightIcon from '@material-ui/icons/ArrowRight';
import ExamListItem from '@/components/ExamListItem'

function Home(props) {
  const history = useHistory()
  const [datas,setData] = useState({})
  const [count,setCount] = useState(0)
  // eslint-disable-next-line
  useEffect(()=>{
    homeDataApi().then(res=>{
      // console.log(res);
      setData(res.data)
      setCount(res.data.exemItems.reduce((prev,current)=>{
        return prev + current.itemCount
      },0))
    }).catch(err=>{
      loginExpire(err,history,props)
    })
  },[])
  return (
    <div className="home">
      <section className="top-title">
        <h2>{datas?.exam?.title}</h2>
        <div className="change-title">
          <span>切换科目</span>
          <ArrowRightIcon />
        </div>
      </section>
      <section className="wel">
        <ul className="grid">
          <li>已学{datas?.study}</li>
          <li>共{count}题</li>
          <li>
            <span className="num">{datas?.wrong}</span>
            <span>错题</span>
          </li>
          <li>
            <span className="num">{datas?.collect}</span>
            <span>收藏</span>
          </li>
        </ul>
      </section>

      <div className="exam-list">
        <section className="title">
          <h2>学科题库{datas?.exemItems?.length}</h2>
          <ul className="list">
            {
              datas?.exemItems?.map(item=>{
                return <li key={item.actionCode}>
                  <ExamListItem data={item} history={history}/>
                </li>
              })
            }           
          </ul>
        </section>
      </div>
    </div>
  )
}

// export default validateLogin(connect(null,globalAlertDispatch)(Home))
export default connect(null,globalAlertDispatch)(validateLogin(Home))
